import React,{ PureComponent } from 'react';

import { Drawer } from 'antd';
import { Conf } from '../../utils';

//消息提示MsgBox
import { Message } from "../Msgbox";
import ButtonEvent from "../ButtonEvent";

/**
 * @param footBar:true|false
 */
class OpenDrawer extends PureComponent{
    state = {
        drawerConf : Conf.drawerConf
    }
    render(){
        let { drawerConf }=this.state;
        let style = drawerConf.style;
        style = Object.assign(style,this.props.style);
        return(
            <Drawer {...drawerConf}>
                <div style={this.props.footBar?style:null}>
                    {this.props.children}
                </div>
                {this.bindtools()}
            </Drawer>
        );
    }
    
    static getDerivedStateFromProps(props, state){
        let { drawerConf }=state;
        drawerConf = Object.assign(drawerConf, props);
        if(props.visible !== state.visible){
            return {
                drawerConf
            }
        }
        return null;
    }


    
    closeDrawer=()=>{
        if(this.props.onClose !== undefined && typeof this.props.onClose === "function"){
            this.props.onClose();
        }else{
            Message("OpenDrawer 组件缺少关闭属性 closeEvent 或者 该属性不是一个方法",'error',{
                title:"关闭出错"
            });
        }
    }
    bindtools=()=>{
        const { footBar } = this.props;
        if(footBar){
            return(
                <div
                    style={{
                        position: 'absolute',
                        bottom: 0,
                        width: '100%',
                        borderTop: '1px solid #e8e8e8',
                        padding: '10px 16px',
                        textAlign: 'right',
                        left: 0,
                        background: '#fff',
                        borderRadius: '0 0 4px 4px',
                    }}
                >
                    <ButtonEvent data={ footBar } />
                </div>
            );
        }
    }
}

export default OpenDrawer;